<template>
  <ma-form ref="crudForm" v-model="form" :columns="columnsOptions" @submit="handlerSubmit">

  </ma-form>
</template>

<script setup>

import {reactive, ref, watch} from "vue";
import {Message} from "@arco-design/web-vue";
import wxcSharerForm from "@/api/wxc/wxcSharerForm.js";

const props = defineProps({
  record: {
    type: Object,
    required: true
  }
})

const crudForm = ref()
const form = ref({
  form_id: 0,
  status: '',
  reason: '',
})

watch(
    () => props.record,
    (newValue) => {
      init(newValue)
    }
)

const init = (record) => {
  if (!Object.keys(record).length) {
    return
  }
  form.value.form_id = record.form_id
  form.value.status = String(record.status)
  form.value.reason = record.reason
}

const columnsOptions = reactive([
  {
    title: "状态",
    dataIndex: "status",
    formType: "select",
    search: true,
    rules: {
      required: true,
      message: "请设置状态"
    },
    dict: {
      // 指定字典名称
      name: 'sharer_form_status',
      // 设置解析数据的label 和 value
      props: {label: 'title', value: 'key'},
      // 对数据进行字典翻译
      translation: true
    }
  },
  {
    title: "原因",
    dataIndex: "reason",
    formType: "textarea",
    hide: true,
    search: false,
    placeholder: "审核不通过的原因",
  },
])

const handlerSubmit = (data, done) => {
  console.log(data)
  done(true)
  wxcSharerForm.audit(data).then(res => {
    if (res.code === 200 && res.success) {
      Message.success('设置成功')
      emitSuccess()
    }else{
      Message.error(res.message)
    }
  })
  done(false)
}


// 向父组件提供一个事件方法：当请求成功时
const emit = defineEmits(['success'])
const emitSuccess = () => {
  emit('success')
}
</script>
